'use strict';

var React = require('react');

var _require = require('./util/date');

var dateStr2Obj = _require.dateStr2Obj;
var obj2DateStr = _require.obj2DateStr;

var DocumentClickMixin = require('./mixin/DocumentClickMixin');
var Calender = require('./Calender3');
var klassName = require('./util/className');

import down from '../../img/up.png'
import up from '../../img/down.png'

var DatePicker = React.createClass({
    displayName: 'DatePicker',

    mixins: [DocumentClickMixin],
    propTypes: {
        onChange: React.PropTypes.func
    },

    getDefaultProps: function getDefaultProps() {
        return {className: ''};
    },
    getInitialState: function getInitialState() {
        var value = this.initDate();
        let pickerSwitch = false;
        if (this.props.pickerSwitch=='true')
            pickerSwitch = true;

        return {value: value, showPicker: pickerSwitch, src: up, pickerSwitch};
    },
    /**
     * 设置时间插件的时间
     * @param time
     */
    setDatePickerValue: function getInitialState(time) {
        this.refs.setTimeValue.setCalenderValue(time); //设置样式
        //设置值
        this.setState({value: time, showPicker: false, src: up});
    },
    initDate: function initDate() {
        var defaultValue = arguments.length <= 0 || arguments[0] === undefined
            ? this.props.value
            : arguments[0];

        var _dateStr2Obj = dateStr2Obj(defaultValue, this.dateParams());

        var year = _dateStr2Obj.year;
        var month = _dateStr2Obj.month;
        var day = _dateStr2Obj.day;

        return obj2DateStr(year, month, day);
    },
    dateParams: function dateParams() {
        var _props = this.props;
        var begin = _props.begin;
        var end = _props.end;

        return {begin: begin, end: end};
    },
    handleValChange: function handleValChange(value) {
        var onChange = this.props.onChange;

        this.setState({value: value, showPicker: this.state.showPicker, src: up});
        if (onChange)
            onChange(value);
        }
    ,
    onOtherDomClick: function onOtherDomClick() {
        this.setState({showPicker: false});
    },
    render: function render() {
        var _this = this;

        var _state = this.state;
        var showPicker = _state.showPicker;
        var value = _state.value;
        var _props2 = this.props;
        var begin = _props2.begin;
        var end = this.initDate();
        var className = _props2.className;
        if (showPicker)
            className += ' _active';
        return React.createElement('div', {
            className: klassName('datepicker', className)
        }, React.createElement('div', {
            className: 'content'
        },

        // React.createElement('input', { className: '_input', onClick: function onClick() {
        //     _this.setState({ showPicker: true });
        // }, value: value, readOnly: true }),

        React.createElement('div', {
            className: '_input',
            onClick: function onClick() {
                _this.setState({showPicker: true, src: down});
            }
        }, value, React.createElement('img', {
            className: 'img',
            src: this.state.src
        }))), React.createElement('div', {
            className: '_picker'
        }, React.createElement(Calender, {
            begin: begin,
            end: end,
            value: value,
            onChange: this.handleValChange,
            ref: "setTimeValue"
        })));
    }
});

module.exports = DatePicker;
